import React, { PureComponent } from 'react';
import _ from 'lodash';
import { Button, Popconfirm } from 'antd';
import { PrimaryGhostC, FirstHeaderC, PrimaryC, NoQueryC, TableC, NoDataC } from '../../../../comps';
import styles from './style.less';
import { connect } from 'dva';

@connect(({ AssetPreparationM, userM: user }) => ({ AssetPreparationM, currentUser: user.currentUser }))
export default class screeningScheme extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      tableData: {},
      loading: true,
      selectedkeys: [],
      sortedInfo: {},
    };
  }
  componentDidMount() {
    if (this.props.currentUser?.userId) {
      this.getData(this.props.currentUser.userId, {
        currentPage: 1,
        numInPage: 10,
      });
    }
  }

  UNSAFE_componentWillReceiveProps(nextProps) {
    if (nextProps.currentUser.userId && this.props.currentUser.userId != nextProps.currentUser.userId) {
      this.getData(nextProps.currentUser.userId, {
        currentPage: 1,
        numInPage: 10,
      });
    }
  }
  //表格分页
  handleTableChange = (pagination, filt, sorter) => {
    const { current, pageSize } = pagination;
    const { field, order } = sorter;
    if (field == 'scheme_name' || field == 'edit' || field == 'user_id') {
      return;
    }
    this.getData(this.props.currentUser.userId, {
      numInPage: pageSize,
      currentPage: current,
      sortItem: field,
      sortType: order,
    });
    this.setState({
      sortedInfo: sorter,
    });
  };

  // 获取数据
  getData = (userId, searchObj) => {
    this.setState({
      loading: true,
    });
    this.props.dispatch({
      type: 'AssetPreparationM/getUserSchemeTable',
      payload: {
        ...searchObj,
      },
      callback: (data) => {
        this.setState({
          tableData: data || {},
          loading: false,
          selectedkeys: [],
        });
      },
    });
  };

  //删除方案
  onDletePro = (e) => {
    if (!e && this.state.selectedkeys.length == 0) return;

    let data = [];
    if (e) {
      data.push(e.scheme_id);
    } else {
      data = this.state.selectedkeys;
    }
    this.props.dispatch({
      type: 'AssetPreparationM/deleteUserScheme',
      payload: data,
      callback: (data) => {
        this.getData(this.props.currentUser.userId, {
          numInPage: this.state.tableData.pageInfo.numInPage,
          currentPage: this.state.tableData.pageInfo.currentPage,
          sortItem: this.state.sortedInfo.field,
          sortType: this.state.sortedInfo.order,
        });
      },
    });
  };

  render() {
    const { tableData = {}, loading, sortedInfo } = this.state;
    const { columns = [], dataSource, pageInfo = {} } = tableData;

    const newColums = [
      ...columns.map((x) => {
        if (x.key === 'scheme_name') {
          return {
            ...x,

            render: (text, record) => <a onClick={() => this.props.goDetail(record.scheme_id)}>{text}</a>,
          };
        } else if (x.key === 'create_time' || x.key === 'update_time') {
          return {
            ...x,
            dataIndex: x.key,
            sorter: true,
            sortOrder: sortedInfo.field === x.key ? sortedInfo.order : false,
          };
        }
        return x;
      }),
      {
        title: '操作',
        dataIndex: 'edit',
        key: 'edit',
        type: 'operate',
        operates: [
          {
            title: '删除',
            onClick: this.onDletePro,
          },
        ],
      },
    ];

    const rowSelection = {
      onChange: (selectedRowKeys, selectedRows) => {
        this.setState({
          selectedkeys: selectedRows.map((x) => x.scheme_id),
        });
      },
    };

    return (
      <>
        <FirstHeaderC title='方案列表'></FirstHeaderC>
        <div style={{ textAlign: 'right', marginBottom: 20 }}>
          <Popconfirm title='是否要删除选中方案？' onConfirm={() => this.onDletePro()}>
            <PrimaryGhostC title='批量删除' disabled={this.state.selectedkeys <= 0} />
          </Popconfirm>
        </div>

        {JSON.stringify(tableData) === '{}' && loading == false ? (
          <NoDataC />
        ) : (
          <TableC
            columns={newColums}
            dataSource={dataSource}
            rowSelection={rowSelection}
            current={Number(pageInfo.currentPage)}
            pageSize={pageInfo.numInPage}
            total={pageInfo.total}
            rowKey={(record) => record.scheme_id}
            loading={loading}
            onChange={this.handleTableChange}
          />
        )}
        <div style={{ textAlign: 'right', marginTop: '20px' }}>
          <PrimaryC title='返回' onClick={() => this.props.goBack(1)} />
        </div>
      </>

      // </div>
    );
  }
}
